//打开页面时，初始化一些东西
$(function() {
    //给添加按钮绑定事件，点击添加按钮，显示 添加/修改 页面
    $('#openAddEditPage').click(function () {
        openEditAddPage(1);
    });


    //关闭添加/修改页面的事件
    $('#closeAddEditPage').click(function () {
        closeAddEditPage();
    });

    //打开页面时，默认展开第一个数据页面
    $('.bl-box')[0].click();





});




//打开 添加/修改  页面，根据参数控制添加还是修改（1 添加， 2修改）
function openEditAddPage(addOrEdit) {
    $('#cover-layer').css('display', 'block');
    $('#closeCollection').css('display', 'none');
    //为了消掉滚动条，把数据清空
    sitesDataVue.loadDatas.sites = null;

    //设置参数为添加
    editAndAdd.addOrEdit = addOrEdit;

    //如果点击的是添加，则应消去 添加框里原本的数据
    if(addOrEdit == 1) {
        editAndAdd.addEditdatas.title = '';
        editAndAdd.addEditdatas.site = '';
        editAndAdd.addEditdatas.description = '';
        editAndAdd.addEditdatas.currentTypeId = 0;
    }
}

//关闭
function closeAddEditPage(){
    $('#cover-layer').css('display', 'none');
    $('#closeCollection').css('display', 'block');

    //重新加载数据
    sitesDataVue.loadData();
}





//格式化日期
function dateFormat(fmt, date) {
    let ret;
    let opt = {
        "Y+": date.getFullYear().toString(),        // 年
        "m+": (date.getMonth() + 1).toString(),     // 月
        "d+": date.getDate().toString(),            // 日
        "H+": date.getHours().toString(),           // 时
        "M+": date.getMinutes().toString(),         // 分
        "S+": date.getSeconds().toString()          // 秒
        // 有其他格式化字符需求可以继续添加，必须转化成字符串
    };
    for (let k in opt) {
        ret = new RegExp("(" + k + ")").exec(fmt);
        if (ret) {
            fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")));
        }
    }
    return fmt;
}

//加载网址收藏数据 =================================================
var sitesDataVue = new Vue({
    el: "#sites_data",
    data: {
        site_types: [],
        loadDatas: {
            pb: {},
            keyWords: '',
            typeId: 0
        },
        addAuthority: 0
    },
    created(){
        this.loadTypeData();
        //启动时就加载第一页数据
        this.loadData();
    },
    methods: {
        showAllSites(){
            //将关键词清空，类别归0
            this.loadDatas.keyWords = '';
            this.loadDatas.typeId = 0;
            this.loadDatas.pb.currentPage = 1;
            this.loadData();
        },
        //格式化日期
        formatDate(now) {
            return dateFormat('YYYY-mm-dd HH:MM:SS', now);
        },
        //翻页
        pageTurning(pageIndex){
            this.loadDatas.pb.currentPage = pageIndex;
            this.loadData();
        },
        //搜索
        searchStart(){
            //刷新数据
            this.pageTurning(1);
        },
        //修改功能第一步，发送id到服务端，以求回显数据
        getWebsitesById(id){
            let param = new URLSearchParams();
            param.append("id", id.toString());
            axios.post("sites/getWeb", param).then(res=>{
                //this.loadDatas = res.data;
                editAndAdd.addEditdatas.title = res.data.title;
                editAndAdd.addEditdatas.site = res.data.site;
                editAndAdd.addEditdatas.description = res.data.description;
                editAndAdd.addEditdatas.currentTypeId = res.data.typeid;
                editAndAdd.addEditdatas.id = id;
                //打开添加/修改页面，设置参数为修改
                openEditAddPage(2);
            }).catch(err=>alert(err));
        },
        //删除功能
        deleteRecord(id) {
            //确定要删除吗？
            if(confirm('确认要删除吗？') == false) {
                return;
            }
            //发送ajax请求到服务端，将要删除的 id 发过去
            let param = new URLSearchParams();



            param.append("id", id);
            axios.post("sites/delete", param).then(res=>{
                //如果删除成功，就重新加载数据
                if(res.data == 'Ok'){
                    //如果刚好最后一页只有一条数据，而且当前页不是第一页，删除了这条数据，现在的页码应该 -1
                    if(this.loadDatas.pb.currentPage > 1 && this.loadDatas.pb.totalCount % this.loadDatas.pb.pageSize == 1) {
                        this.loadDatas.pb.currentPage--;
                    }
                    this.loadData();
                } else if(res.data == 'No') {
                    console.log('删除失败');
                }
                console.log(res.data);

            }).catch(err=>alert(err));
        },
        //加载数据
        loadData() {
            this.loadDatas.sites = null;
            //显示所有数据
            axios({
                url:"sites/all",
                method:"post",
                data: {
                    'pb': this.loadDatas.pb,
                    'keyWords': this.loadDatas.keyWords,
                    'typeId': this.loadDatas.typeId
                }
            }).then(res=>{
                // console.log(res);
                //将数据赋值到vue实例中的数据属性users；
                //不能使用this，在axios回调函数中表示窗口，不是vue实例
                this.loadDatas = res.data;
                // console.log(new Date(sitesDataVue.loadDatas.sites[0].editTime));
            }).catch(err=>alert(err));
        },
        //发送AJAX请求，加载类别信息
        loadTypeData(){
            axios({
                url:"type/atypes",
                method:"post"
            }).then(res=>{
                // console.log(res);
                //将数据赋值到vue实例中的数据属性users；
                //不能使用this，在axios回调函数中表示窗口，不是vue实例
                this.site_types = res.data;
                editAndAdd.site_types = res.data;
            }).catch(err=>alert(err));
        }

    },
    computed: {
        //是否显示增加、修改、删除按钮：
        addEditDel(){
            return this.addAuthority == 1 || this.addAuthority == 3 ? true : false;
        }
    }
});

//增加、修改数据页面  =============================================
var editAndAdd = new Vue({
    el: "#cover-layer",
    data: {
        //判断是添加还是修改（1 添加，  非 1 修改）
        addOrEdit: 1,
        site_types: [],

        //要添加或修改的数据
        addEditdatas: {
            id: 0,
            title: '',
            site: '',
            description: '',
            currentTypeId: 0
        }

    },
    methods: {
        //提交数据（根据 this.addOrEdit 判断是添加还是修改）
        submitWebsite(){
            //校验输入框
            if(this.addEditdatas.title == '' || this.addEditdatas.site == '' || this.addEditdatas.description == '' || this.addEditdatas.currentTypeId == 0) {
                alert('参数不能为空');
                return;
            }
            if(this.addOrEdit == 1) {
                // console.log('添加数据');
                axios({
                    url:"sites/add",
                    method:"post",
                    data: {
                        'title': this.addEditdatas.title,
                        'site': this.addEditdatas.site,
                        'description': this.addEditdatas.description,
                        'typeid': this.addEditdatas.currentTypeId
                    }
                }).then(res=>{
                    // console.log(res);
                    //将数据赋值到vue实例中的数据属性users；
                    //不能使用this，在axios回调函数中表示窗口，不是vue实例
                    //this.loadDatas = res.data;
                    // console.log(new Date(sitesDataVue.loadDatas.sites[0].editTime));
                    alert(res.data)
                }).catch(err=>alert(err));

            } else if(this.addOrEdit == 2) {
                // console.log('修改数据');
                /*let param = new URLSearchParams();
                param.append("id", id.toString());
                axios.post("sites/getWeb", param).then(res=>{
                    this.loadDatas = res.data;
                    editAndAdd.addEditdatas.title = res.data.title;
                    editAndAdd.addEditdatas.site = res.data.site;
                    editAndAdd.addEditdatas.description = res.data.description;
                    editAndAdd.addEditdatas.currentTypeId = res.data.typeid;
                    //打开添加/修改页面，设置参数为修改
                    openEditAddPage(2);
                }).catch(err=>alert(err));*/

                axios({
                    url:"sites/edit",
                    method:"post",
                    data: {
                        'id': this.addEditdatas.id,
                        'title': this.addEditdatas.title,
                        'site': this.addEditdatas.site,
                        'description': this.addEditdatas.description,
                        'typeid': this.addEditdatas.currentTypeId
                    }
                }).then(res=>{
                    // console.log(res);
                    //将数据赋值到vue实例中的数据属性users；
                    //不能使用this，在axios回调函数中表示窗口，不是vue实例
                    //this.loadDatas = res.data;
                    // console.log(new Date(sitesDataVue.loadDatas.sites[0].editTime));
                    if(res.data == "Ok") {
                        alert('修改成功');
                        //修改成功后关闭修改页面
                        closeAddEditPage();
                    }
                }).catch(err=>alert(err));

            }

            //无论是添加还是修改，都应该清掉原本的数据
            this.addEditdatas.title = '';
            this.addEditdatas.site = '';
            this.addEditdatas.description = '';
            this.addEditdatas.currentTypeId = 0;
        }
    }
});

//登录功能 =========================================================
var loginVue = new Vue({
    el: "#login-page",
    data: {
        username: '',
        password: '',
        userAuthority: {
            username: null,
            password: null
        }
    },
    methods: {
        loginSend(){
            axios({
                url:"user/login",
                method:"post",
                data: {
                    'username': this.username,
                    'password': this.password
                }
            }).then(res=>{
                this.userAuthority = res.data;
                var nowAuthority = this.userAuthority.authority;
                //console.log(res.data);
                if(res.data == 'No') {
                    //this.username = '';
                    this.password = '';
                    alert('登陆失败，用户名或密码错误');
                } else if(nowAuthority == 1 || nowAuthority == 2 || nowAuthority == 3) {
                    //登陆成功，清空已经输入用户名和密码
                    this.username = '';
                    this.password = '';

                    //登陆成功，则刷新数据
                    sitesDataVue.loadTypeData();
                    sitesDataVue.loadData();

                    //添加权限，控制添加按钮的显示隐藏
                    sitesDataVue.addAuthority = res.data.authority;

                    //登陆成功，关闭登录页面，打开数据页面
                    $('#loginPageClose').click();
                    $('.bl-box')[0].click();
                }
            }).catch(err=>alert(err));
        },
        logOut(){
            axios({
                url:"user/logOut",
                method:"post",
                data: {
                    'username': this.username,
                    'password': this.password
                }
            }).then(res=>{
                //console.log(res.data);
                if(res.data == 'OK') {
                    this.userAuthority = {username: null, password: null};

                    //添加权限，控制添加按钮的隐藏
                    sitesDataVue.addAuthority = 0;

                    //重新刷新数据
                    sitesDataVue.loadTypeData();
                    sitesDataVue.loadData();
                }
            }).catch(err=>alert(err));
        }
    },
    created() {
        //加载时就发送ajax请求，询问是否登录成功
        axios({
            url:"user/isLogin",
            method:"post"
        }).then(res=>{
            this.userAuthority = res.data;
            sitesDataVue.addAuthority = res.data.authority;
        }).catch(err=>alert(err));
    }
});
